<template>
	<view class="sport-content">
		<view class="sport-header">
			<image src="../../static/imgs/campus/sportsTitle.png"></image>
		</view>
		<view class="sport-search">
			<view class="text_opblack">请填写查询体测相关信息</view>
			<view class="sport-search-input">
				<view class="text_black">体测预留手机号</view>
				<input v-model="search.phone" :maxlength="11" type="number" placeholder="请填写体测预留手机号"/>
			</view>
			<view class="sport-search-input">
				<view class="text_black">体测的姓名</view>
				<input v-model="search.name" placeholder="请填写体测的姓名"/>
			</view>
		</view>
		<view v-if="data.length==0" class="button" @click="getData">一键获取体测数据</view>
		<view v-if="data.length>0" class="sport-list" v-for="(pItem,pIndex) in data" :key="pIndex">
			<view class="text_black">{{pItem.name}}</view>
			<view class="text_opblack">体测时间：{{pItem.gmtCreate}}</view>
			<view class="sport-group" v-for="(item,index) in list" :key="index">
				<view class="sport-item">
					<view>{{item.title}}</view>
					<view v-if="item.datas&&pItem[item.failed]">
						<view v-for="(citem,cindex) in item.datas" :key="index" v-if="citem.id==pItem[item.failed]">{{citem.name}}</view>
					</view>
					<view v-else>{{item.failed.length>0&&pItem[item.failed]?pItem[item.failed]:'未测试'}}</view>
				</view>
			</view>
		</view>

		<uni-popup ref="popup" type="center" :maskClick="false">
			<view class="popup-content">
				<image src="../../static/imgs/campus/sports-tips.png"></image>
				<view class="text_black">正在读取数据...</view>
				<view class="text_opblack tips">
					请稍后，正在从<text class="text_black">智能体测设备</text>中读取数据，这个过程可能需要一些时间
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import uniPopup from "../../components/uni-popup/uni-popup.vue";
	import {
		getPhysical
	} from "../../static/js/api/user.js";
	export default {
		components: {
			uniPopup
		},
		data() {
			return {
				loading: false,
				data: [],
				search:{
					phone:'',
					name:'',
				},
				list: [
					{
						title: "性别",
						failed: "sex",
						datas:[
							{
								id:'M',
								name:'男性'
							},{
								id:'F',
								name:'女性'
							}
						]
					},
					{
						title: "年龄",
						failed: "age",
					},
					{
						title: "身体年龄",
						failed: "bodyAge",
					}, {
						title: "身高",
						failed: "height",
					}, {
						title: "体重",
						failed: "weight",
					}, {
						title: "理想体重",
						failed: "perfectWeight",
					}, {
						title: "体脂率",
						failed: "fat",
					}, {
						title: "体脂控制建议",
						failed: "fatControl",
					}, {
						title: "肌肉率",
						failed: "muscle",
					}, {
						title: "肌肉控制建议",
						failed: "muscleControl",
					},
					{
						title: "形体判定",
						failed: "bodyShape",
						datas: [
							{
								id: 0,
								name: "隐形肥胖"
							}, {
								id: 1,
								name: "偏胖"
							},
							{
								id: 2,
								name: "肥胖"
							},
							{
								id: 3,
								name: "偏瘦肌肉"
							},
							{
								id: 4,
								name: "标准型"
							},
							{
								id: 5,
								name: "非常肌肉"
							},
							{
								id: 6,
								name: "偏瘦"
							},
							{
								id: 7,
								name: "标准肌肉"
							},
							{
								id: 8,
								name: "运动不足"
							}]
					},
					{
						title: "基础代谢",
						failed: "bmr",
					},
					{
						title: "心肺功能评级",
						failed: "heartFun",
					},
					{
						title: "平衡能力",
						failed: "balance",
						datas:[
							{id:1,name:'很差'},
							{id:2,name:'较差'},
							{id:3,name:'一般'},
							{id:4,name:'较好'},
							{id:5,name:'很好'},
						]
					},{
						title: "平衡能力",
						failed: "balanceAngle",
					},
					{
						title: "驼背风险",
						failed: "humpbackRisk",
					},
					{
						title: "X、O型腿",
						failed: "legRisk",
					},
					{
						title: "骨盆前倾风险",
						failed: "pelvisRisk",
					},
					{
						title: "BMI",
						failed: "bmi",
					},
					{
						title: "骨量",
						failed: "bone",
					},
					{
						title: "有氧运动目标",
						failed: "aerobicGoal",
					},
					{
						title: "敏捷反应时间",
						failed: "agility",
					},
					{
						title: "无氧运动目标",
						failed: "anaGoal",
					},
					{
						title: "每日热量摄入",
						failed: "caloriesInput",
					},{
						title:"体能耐力每日运动目标",
						failed: "enduGoal",
					},{
						title:'内脏脂肪',
						failed:'inFat'
					},{
						title:'蛋白质',
						failed:'protein'
					},{
						title:'每日总运动目标',
						failed:'sportGoal'
					},{
						title:'皮下脂肪',
						failed:'subFat'
					},{
						title:'肺活量',
						failed:'vitalCapacity'
					},{
						title:'收缩压',
						failed:'bloodMaxPressure'
					},{
						title:'舒张压',
						failed:'bloodMinPressure'
					},{
						title:'静态心率',
						failed:'restingHeartRate'
					},{
						title:'血氧浓度',
						failed:'bloodOxygen'
					},{
						title:'身体水分',
						failed:'water'
					},{
						title:'高低肩风险等级',
						failed:'shoulderRisk'
					},{
						title:'左上肌肉',
						failed:'muscleLeftArm'
					},{
						title:'右上肌肉',
						failed:'muscleRightArm'
					},{
						title:'左上脂肪',
						failed:'fatLeftArm'
					},{
						title:'右上脂肪',
						failed:'fatRightArm'
					},{
						title:'躯干肌肉',
						failed:'muscleTrunk'
					},{
						title:'躯干脂肪',
						failed:'fatTrunk'
					},{
						title:'左下肌肉',
						failed:'muscleLeftLeg'
					},{
						title:'右下肌肉',
						failed:'muscleRightLeg'
					},{
						title:'左下脂肪',
						failed:'fatLeftLeg'
					},{
						title:'右下脂肪',
						failed:'fatRightLeg'
					},{
						title:'20kHz左上肢',
						failed:'r20LeftArm'
					},{
						title:'20kHz左下肢',
						failed:'r20LeftLeg'
					},{
						title:'20kHz右上肢',
						failed:'r20RightArm'
					},{
						title:'20kHz右下肢',
						failed:'r20RightLeg'
					},{
						title:'20kHz躯干',
						failed:'r20Trunk'
					},{
						title:'100kHz左上肢',
						failed:'r100LeftArm'
					},{
						title:'100kHz左下肢',
						failed:'r100LeftLeg'
					},{
						title:'100kHz右上肢',
						failed:'r100RightArm'
					},{
						title:'100kHz右下肢',
						failed:'r100RightLeg'
					},{
						title:'100kHz躯干',
						failed:'r100Trunk'
					},{
						title:'腰臀比',
						failed:'wc'
					},{
						title:'腰围长度',
						failed:'waist'
					},{
						title:'臀围长度',
						failed:'hips'
					},{
						title:'头部高度',
						failed:'head'
					},{
						title:'上半身长度',
						failed:'upperBody'
					},{
						title:'下半身长度',
						failed:'lowerBody'
					},{
						title:'小腿长度',
						failed:'shank'
					},{
						title:'大腿长度',
						failed:'thigh'
					},{
						title:'臂展',
						failed:'armSpan'
					},{
						title:'臂围',
						failed:'armDim'
					},{
						title:'大腿维度',
						failed:'thigh_dim'
					},{
						title:'肩宽',
						failed:'shoulder_width'
					},{
						title:'枕间距',
						failed:'occipital_space'
					},
					{
						title:'体测评分',
						failed:'score'
					}
				]
			}
		},
		onLoad() {
			// this.getData()
		},
		methods: {
			getData() {
				let _this = this
				if(_this.search.phone.length==0){
					uni.showToast({
						title:"请填写体测相关信息后再查询",
						icon:"none"
					})
					return
				}
				if(_this.search.name.length==0){
					uni.showToast({
						title:"请填写体测相关信息后再查询",
						icon:"none"
					})
					return
				}
				// this.$refs.popup.open()
				getPhysical({
					phone: _this.search.phone,
					name:_this.search.name
				}).then(res => {
					console.log(res)
					// this.$refs.popup.close()
					this.data = res
					if(res&&res.length==0){
						uni.showToast({
							icon:'none',
							title:"未查询到体测相关信息",
						})
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import url("./index.scss");

	.text_opblack {
		color: $uni-text-color-opblack;
	}

	.text_black {
		color: $uni-text-color-black;
	}

	.sport-header {
		background-color: #fff;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 40rpx 0;

		image {
			width: 674rpx;
			height: 372rpx;
		}
	}
	.sport-search{
		.text_opblack{
			line-height: 74rpx;
			height: 74rpx;
			padding-left: 30rpx;
			font-size: 24rpx;
			font-weight: 400;
		}
		.sport-search-input{
			width: calc(100% - 60rpx);
			padding: 0 30rpx;
			display: flex;
			background-color: #fff;
			height: 100rpx;
			align-items: center;
			justify-content: space-between;
			border-bottom:2rpx solid #f7f7f7;
			font-size: 32rpx;
			font-weight: 400;
			input{
				text-align: right;
				font-size: 32rpx;
				font-weight: 400;
			}
		}
	}
	.button{
		margin-top: 60rpx;
	}

	.popup-content {
		width: 490rpx;
		height: 424rpx;
		background-color: #fff;
		border-radius: 20rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 40rpx 40rpx;

		image {
			width: 154rpx;
			height: 232rpx;
		}

		.text_black {
			font-size: 36rpx;
			font-weight: bold;
			margin-top: 20rpx;
		}

		.tips {
			font-size: 30rpx;
			font-weight: 400;
			line-height: 50rpx;
			text-align: center;
			margin-top: 20rpx;

			text {
				font-size: 30rpx;
			}
		}
	}

	.sport-list {
		background-color: #fff;

		.text_black {
			font-size: 36rpx;
			font-weight: bold;
			padding-left: 30rpx;
			padding-top: 20rpx;
		}

		.text_opblack {
			font-size: 28rpx;
			font-weight: 400;
			padding-left: 30rpx;
			padding-bottom: 20rpx;
			line-height: 40rpx;
		}
	}

	.sport-item {
		display: flex;
		height: 100rpx;
		justify-content: space-between;
		align-items: center;
		width: calc(100% - 60rpx);
		padding: 0 30rpx;
		border-bottom: 1px solid #F5F5F5;
		font-size: 32rpx;
		font-weight: 400;
	}
</style>